<div class="container">
    <form class="form-signin" #f="ngForm" (ngSubmit)="loginHandle(f)">
        <h2 class="form-signin-heading">Please sign up</h2>
        <div class="form-group">
            <label for="email" class="sr-only">Email address</label>
            <input #email="ngModel" type="email" email="true" name="email" id="email"
                class="form-control" placeholder="登录邮箱" required autofocus [(ngModel)]="f.email">
            <!-- 表单验证 -->
            <div class="alert alert-danger" *ngIf="email.invalid && ( email.dirty || email.touched )">
                <div *ngIf="email.errors.required">
                    <b>* </b> 请填写登录邮箱
                </div>
                <div *ngIf="email.errors.email">
                    <b>* </b> 邮箱格式错误
                </div>
            </div>
        </div>


        <div class="form-group">
            <label for="password" class="sr-only">Password</label>
            <input #password="ngModel" type="password" name="password" [(ngModel)]="f.passowrd" id="password"
                class="form-control" placeholder="登录密码" required minlength="6">
            <!-- 表单验证 -->
            <div class="alert alert-danger" *ngIf="password.invalid && ( password.dirty || password.touched )">
                <div *ngIf="password.errors.required">
                    <b>* </b> 请填写登录密码
                </div>
                <div *ngIf="password.errors.minlength">
                    <b>* </b> 登录密码长度最少为6位
                </div>
            </div>
        </div>

        <button [disabled]="!f.valid" class="btn btn-lg btn-primary btn-block" type="submit">立即登录</button>
    </form>
    <p class="info"><a href="javascript:;" routerLink="/reg">Don't have an account? Create one here.</a></p>
    
</div>